<template>
  <div class="tableComonTop flex">
    <div class="flex-common">
      <div class="fs-16 cr-hui3">{{ text }}</div>
      <div class="option mr-16" v-if="options.length > 0">
        <selectName
          :selectArr="options"
          :title="true"
          :value="optionValue"
          :valueKey="valueKey"
          :keys="keys"
          :label="label"
          @dropDown="changeValue"
        >
          <div class="fs-16 cr-hui3">{{ optionsTitle }}</div>
        </selectName>
      </div>
      <div class="input" v-if="placeholder.length > 0">
        <el-input
          :placeholder="placeholder"
          prefix-icon="el-icon-search"
          v-model="inputValue"
          @input="(event) => $emit('outInputValue', event)"
        >
        </el-input>
      </div>
      <div class="time" v-if="showTime">
        <Time
          :type="type"
          :title="true"
          :value="tableTimeValue"
          @valueChange="(event) => $emit('outValue', event)"
        ></Time>
      </div>
      <div class="more" @click="upload" v-if="uploadTrue">导出</div>
    </div>
    <div class="btn" v-if="nameArr.length > 0">
      <seleBtn
        :nameArr="nameArr"
        :stu="oneIndex"
        @seleClick="(event) => $emit('outClick', event)"
      ></seleBtn>
    </div>
  </div>
</template>

<script>
import exportInterface from "@/utils/exportInterface";
export default {
  name: "laboratoryRightTableHeader",
  props: {
    uploadTrue: {
      type: Boolean,
      default: true,
    },
    type: {
      type: String,
      default: "datetimerange",
    },
    exportInterfaceName: {
      type: String,
      default: "frontpageexport",
    },
    formData: {
      type: String,
      default: "formData",
    },
    showTime: {
      type: Boolean,
      default: true,
    },
    placeholder: {
      type: String,
      default: "",
    },
    options: {
      type: Array,
      default: () => {
        return new Array();
      },
    },
    optionsTitle: {
      type: String,
      default: "",
    },

    oneIndex: {
      type: Number,
      default: 0,
    },
    nameArr: {
      type: Array,
      default: () => {
        return new Array();
      },
    },
    text: {
      type: String,
      default: "",
    },
    keys: {
      type: String,
      default: "",
    },
    label: {
      type: String,
      default: "",
    },
    valueKey: {
      type: String,
      default: "",
    },
    tableTimeValue: {
      type: [Array, Date, String],
      default: () => new Date(),
    },
  },
  data() {
    return {
      exportInterface: exportInterface.exportInterface,
      inputValue: "",
      optionValue: "",
    };
  },
  methods: {
    upload() {
      // console.log("this.expor tInterfaceName", this.exportInterfaceName);
      let params = {
        startTime: this.$getTime(this.tableTimeValue[0]),
        endTime: this.$getTime(this.tableTimeValue[1]),
      };
      // console.log(this.exportInterfaceName);
      Object.assign(params, this.getInterfaceParams(this.exportInterfaceName));
      this.exportInterface(this.exportInterfaceName, params);
    },
    getInterfaceParams(name) {
      switch (name) {
        case "envManageexport":
          return {
            equipmentNo: this.$parent[this.formData].equipmentNo,
            laboratoryNo: this.$parent.laboratoryNo,
          };
        case "errorenvManageexport":
          return {
            equipmentNo: this.$parent[this.formData].equipmentNo,
            equipmentType: this.$parent[this.formData].equipmentType,
            laboratoryNo: this.$parent.laboratoryNo,
          };
        case "accessManageexport":
          return {
            laboratoryNo: this.$parent.laboratoryNo,
          };
        case "baseEquipmentExport":
          return {
            laboratoryNo: this.$parent.laboratoryNo,
            equipmentName: this.$parent[this.formData].equipmentName,
            equipmentType: this.$parent[this.formData].equipmentType,
          };
      }
    },
    changeValue(event) {
      this.optionValue = event;
      this.$emit("outOptionValue", event);
    },
  },
};
</script>

<style lang="scss" scoped>
.tableComonTop {
  height: 64px;
  .more {
    cursor: pointer;
    margin-left: 24px;
    width: 90px;
    height: 28px;
    border: 1px solid #00bfb1;
    border-radius: 2px;
    text-align: center;
    font-size: 14px;
    font-family: Source Han Sans CN;
    font-weight: 400;
    color: #00bfb1;
    line-height: 28px;
  }
  .input {
    height: 24px;
    line-height: 24px;
    margin-right: 20px;
    /deep/.el-input__inner {
      height: inherit !important;
      line-height: inherit !important;
    }
  }
}
</style>